<?php include($__SKIN__ . "ajax.inc.php");?>


<!---
@自动生成 BY Kupe框架 www.kupebank.com
#date : 2017-11-02 09:32:35
#path : app/template/admin/user.indexcategory.html
--->
{include file="header.inc.html"}
<style>
.sub{
	text-indent:30px;
}
.toggle,.editop{
	cursor:pointer;
}
</style>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
	  {include file="left.inc.html"}  
	  <div class="layui-body">
		<!-- 内容主体区域 -->
		<div style="padding: 15px;">


			<div class="layui-breadcrumb">
			   {include file="where.inc.html"}
			</div>

			<div class="demoTable">
			  搜索用户名/姓名：
			  <div class="layui-inline">
				<input class="layui-input" id="keyword" autocomplete="off">
			  </div>
			  <button class="layui-btn" data-type="reload">{:showIcon('搜索')}搜索</button>
			</div>
			 
			
<div id="main_table_id">
		<table lay-filter="main_table_" class="layui-table" id="main_table">
		  <colgroup>
			<col width="60">
			<col width="80">
			<col width="80">
			<col width="60">
			<col width="60">
			<col width="250">
			<col>
		  </colgroup>
		<thead>
		
		</thead>
		

</table></div>





			<button class="layui-btn layui-layout-rightxx add" >{:showIcon('add')}添加用户</button>
			{**###################################################**}
			
		</div>	
	  </div><!-- /layui-body -->


<script>



layui.use(['table','layer'], function(){
  var table = layui.table, $ = layui.$ , layer = layui.layer;
	
	/*输出*/
	var tableIns = table.render({
		elem:'#main_table',
		cols:  [[ 
				{checkbox: true}
				,{field: 'id', title: '唯一标识', width: 100,sort:true}
				,{field: 'group_name', title: '所在分组', width: 150,toolbar:'#barGroupname'}
				,{field: 'login', title: '用户名', width: 120}
				,{field: 'name', title: '姓名', width: 120,sort:true,edit:'text'}

				
				//,{field: 'level', title: '用户等级', width: 100}
				,{field: 'status', title: '状态', width: 80,sort:true,edit:'text', templet: '#statusTpl'}
				 ,{field: 'porder', title: '排序', width: 80,edit:'text',sort:true}
				,{field: 'op', title: '操作', width: 300, toolbar: '#barDemo'}
			  ]],
		data : [],
		url : '{_url m="index" ajax=1}',
		//limits : [1,2,3,10],
		//limit : 1,
		page : true
	});
	$('#keyword').dblclick(function(){
		$(this).val('');
	});

	$('.demoTable .layui-btn').click(function(){
		tableIns.reload({
			where : {"keyword": $('#keyword').val()}
		});
	});
	$.each($('.add'),function(){		
		$(this).click(function(){
			openPage('{_url m="add"}','添加用户');
		});
	});	


	

	/*//监听工具条*/
	table.on('tool(main_table_)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
	  var data = obj.data; //获得当前行数据
	  var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
	  var tr = obj.tr; //获得当前行 tr 的DOM对象
	 
	  if(layEvent === 'detail'){ //查看
		//do somehing
	  } else if(layEvent === 'del'){ //删除
		layer.confirm('真的删除本条信息么?', function(index){
		  obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
		  layer.close(index);
		  //向服务端发送删除指令
		  $.get('{_url  m="dodelete"}&id='+data.id,function(d){
			 d = gjson(d);
			 layui.layer.msg(d.msg);
		  });

		});
	  } else if(layEvent === 'edit'){ //编辑
		//do something
		openPage('{_url m="edit"}&id='+data.id,'编辑用户');		
		
		/*//同步更新缓存对应的值
		obj.update({
		  username: '123'
		  ,title: 'xxx'
		});*/
	  }else if(layEvent === 'editgroup'){
		openPage('{_url m="editcategory"}&id='+data.group_id,'编辑用户分组');
	  }
	});

	doFastEdit('{_url m="fast"}', 'main_table_');


	
});


      

/*<input type="checkbox" name="status" value=1 checked lay-skin="switch">*/
</script>
{html}
<script type="text/html" id="statusTpl">
 {{# if (d.status == 1) { }}		
		开启
	{{#  } else { }}
		关闭
	 {{#  } }}
</script>
<script type="text/html" id="barGroupname">

<a class="layui-btn layui-btn-mini editgroup" lay-event="editgroup">{{d.group_name}}</a>
</script>
<script type="text/html" id="barDemo">  
  <a class="layui-btn layui-btn-mini edit" lay-event="edit" data="{{d.id}}">编辑用户</a>
  <a class="layui-btn layui-btn-danger layui-btn-mini del" data="{{d.id}}" lay-event="del">删除用户</a>  

</script>

{/html}
{include file="footer.inc.html"}

